<template>
  <!--收货地址管理-->
  <view class="address-lists-containter">
    <block v-if="addLists.length === 0">
      <!--收货地址为空时-->
      <view class="empty">
        <image class="empty_icon" src="../../static/img/common/icon_address.png" />
        <view class="empty_tips">暂无数据</view>
      </view>
    </block>
    <block v-else>
      <scroll-view class="address-item-wrap" scroll-y="true" bind:scrolltolower="scrollToBottom">
        <block v-for="(item, index) in addLists" :key="index">
          <view class="address-item-containter">
            <view class="left" @tap="onSelect(item)">
              <view class="tips">
                <view class="tips_top">
                  {{ item.titleType === 1 ? '个人' : item.invoiceTitle }}
                  <view class="tips_default" v-if="item.isDefault">[ 默认 ]</view>
                </view>
                <view v-if="item.titleType === 0" class="tips_bottom">
                  {{ item.taxNumber
                  }}</view>
                  <view v-else class="tips_bottom">
                  {{ item.invoiceTitle
                  }}</view>
              </view>
            </view>
            <!-- <icon class="icon_delete" color="red" type="cancel" size="22" /> -->
            <image class="icon_mod" @tap="onMod(item)" src="../../static/img/common/icon_mod.png" />
          </view>
        </block>
      </scroll-view>
    </block>
    <!--新增收货地址-->
    <view class="button_2 btn_add" @tap="onAddAddress">新增发票抬头</view>
  </view>
</template>

<script>
import { invoice } from "../../services/index.js";
export default {
  data() {
    return {
      readOnly: true, //是否可以编辑
      addLists: [], //已添加的地址列表
      selectedAddress: {}, //选择的地址
      from: undefined,
    };
  },
  mounted() { },
  onLoad() { },
  methods: {
    async getInvoiceTitleList() {
      uni.showLoading();
      let res = await invoice.getInvoiceTitleList();
      if (res.code === 200) {
        this.addLists = res.data;
      }
      uni.hideLoading();
    },
    onLoad(params) {
      this.from = params.from;
      // let data = getPageData();
      // this.setData({
      //     readOnly: !data.readOnly
      // })
    },
    onShow() {
      this.getInvoiceTitleList();
    },
    //刷新页面
    refresh() { },
    //添加收获地址
    onAddAddress() {
      uni.navigateTo({
        url: "/pages/invoiceEdit/index",
      });
    },
    //确认收货地址
    onSelectAddress() {
      if (Object.keys(this.data.selectedAddress).length === 0) {
        showTxtToast("请选择收货地址");
        return false;
      }
      setHashData({ selectedAddress: this.data.selectedAddress });
      wx.navigateBack({
        //返回
        delta: 1,
      });
    },
    onSelect(item) {
      if (this.from === "orderInvoice") {
        wx.setStorageSync("selectInvoiceId", item.id);
        wx.navigateBack({
          //返回
          delta: 1,
        });
      }
    },
    /**
     * 修改
     */
    onMod(item) {
      uni.navigateTo({
        url: "/pages/invoiceEdit/index?invoiceId=" + item.id,
      });
    },
  },
};
</script>

<style scoped>
.address-lists-containter {
  position: relative;
  width: 100%;
  height: 100%;
}

.empty {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.empty_icon {
  margin-top: 20rpx;
  width: 130rpx;
  height: 170rpx;
}

.empty_tips {
  margin-top: 50rpx;
  font-size: 30rpx;
  color: rgba(102, 102, 102, 1);
}

.btn_add {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 130rpx;
}

.address-item-wrap {
  height: calc(100% - 100rpx);
}

.panel {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.input {
  height: 440rpx;
  background: #fff;
}

.address-item-containter {
  position: relative;
  width: 100%;
  height: 130rpx;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 20rpx 0;
}

.left {
  width: 90%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 20rpx;
}

.tips {
  width: 86%;
}

.tips_top {
  font-size: 26rpx;
  color: rgba(51, 51, 51, 1);
}

.tips_default {
  margin-left: 15rpx;
  display: inline;
  color: rgba(242, 85, 0, 1);
}

.tips_bottom {
  margin-top: 10rpx;
  font-size: 22rpx;
  color: rgba(85, 85, 85, 1);
  overflow-x: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.icon_flag {
  margin-right: 30rpx;
  width: 26rpx;
  height: 26rpx;
}

.icon_mod {
  width: 30rpx;
  height: 30rpx;
  margin-right: 20rpx;
  padding: 30rpx;
}

.address-add-containter {
  position: relative;
  width: 100%;
  height: 100%;
}

.add-container {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  margin-top: 30rpx;
}

.row_name {
  margin-top: 20rpx;
}

.panel {
  background: #fff;
  height: 440rpx;
  width: 100%;
  margin-bottom: 80rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
</style>